<template>
  <view>
    <view class="pp20 f13">
		<!--  -->
      <view class="mt10" style="display: flex">
        <text class="c84 mr10">主诉</text>
        <view class="">
          <textarea
            name=""
            disabled
            v-model="form.description"
            placeholder=""
            id=""
            cols="30"
            rows="10"
            style="
              font-size: 24rpx;
              background-color: #f5f5f5;
              padding: 20rpx;
              border-radius: 10rpx;
              padding-bottom: 50rpx;
            "
          ></textarea>
        </view>
      </view>

      <view class="mt10" style="display: flex">
        <text class="c84 mr10">诊断</text>
        <view class="">
          <textarea
            name=""
            disabled
            v-model="form.diagnose"
            placeholder=""
            id=""
            cols="30"
            rows="10"
            style="
              font-size: 24rpx;
              background-color: #f5f5f5;
              padding: 20rpx;
              border-radius: 10rpx;
              padding-bottom: 50rpx;
            "
          ></textarea>
        </view>
      </view>

      <view class="mt10" style="display: flex">
        <text class="c84 mr10">医嘱</text>
        <view class="">
          <textarea
            name=""
            disabled
            v-model="form.consultationSuggestion"
            placeholder=""
            id=""
            cols="30"
            rows="10"
            style="
              font-size: 24rpx;
              background-color: #f5f5f5;
              padding: 20rpx;
              border-radius: 10rpx;
              padding-bottom: 50rpx;
            "
          ></textarea>
        </view>
      </view>

      <view class="mt10" style="display: flex">
        <text class="c84 mr10">用药</text>
        <view class="">
          <textarea
            name=""
            disabled
            v-model="form.medicationSuggestion"
            placeholder=""
            id=""
            cols="30"
            rows="10"
            style="
              font-size: 24rpx;
              background-color: #f5f5f5;
              padding: 20rpx;
              border-radius: 10rpx;
              padding-bottom: 50rpx;
            "
          ></textarea>
        </view>
      </view>

      <!-- 药品 -->
	  <!-- v-if="false"-->
      <view class="" >
        <!-- 标题 -->
        <view class="mt10">
          <text class="c84 mr10">药品</text>
        </view>
        <!-- 内容 -->
        <view  class="mt10 drugBg" >
		  <!-- -->
          <view class="p-10" v-for="(item,index) in form.upDuctList">
            <view class="fa f14">
              <image
                :src="item.uproductPic|| '/static/online/yao.png'"
                mode="widthFix"
                style="width: 100rpx"
                class="mr10"
              >
              </image>
              <view class="f1">
                <view class="fa">
                  <view class="f1"> {{item.uproductName || '云南白药蒲地蓝消炎片'}}</view>
                  <!-- <view class=""> ￥48.00 </view> -->
                </view>
                <view class="mt5 fa">
                  <view class=""> x {{item.count}} </view>
                </view>
              </view>
            </view>
            <view class="c84 mt10">
			  {{item.usageMethod || '用法用量：每日3次，每次10.0毫升，饭后服用'}}
            </view>
          </view>
        </view>
      </view>
	  
      <!-- 计算 -->
      <view class="fa f12 mt10" v-if="false">
        <view class="f1"> 合计 共2件 </view>
        <view class="f16" style="color: #f8662d"> ￥63.00 </view>
      </view>
      <!-- 提示 -->
      <view class="mt30">
        <view class="f13 c84"> 特别提示 </view>
        <view class="f13 c84">
          <view class="mt5">
            1. 处方有效期24小时内有效，请提醒患者及时取药。
          </view>
          <view class="mt5"> 2. 本处方仅限于医健通互联网医院使用。 </view>
          <view class="mt5">
            3.如果您对处方有任何疑问，请拨打124121212，联系平台客服进行处理。
          </view>
        </view>
      </view>
    </view>
	
    <!-- 		<view class="fa mt50">
			<button @click="back" style=" background-color: transparent;width: 240rpx;height: 90rpx;border: 1rpx solid #CCCCCC;border-radius: 50rpx;
			font-size: 30rpx;line-height: 90rpx;">返回修改</button>
			<button @click="back" style="background-color: #2D81FF;color: white;font-size: 30rpx;width: 380rpx;height: 90rpx;line-height: 90rpx;
			border-radius: 50rpx;">确认并发送给患者</button>
		</view> -->
  </view>
</template>

<script>
export default {
  data() {
    return {
      word: "css 省略号表示溢出文本， 可以通过设置不同的属性来实现。 例如， 可以使用overflow: hidden、 text - overflow: ellipsis、 text -overflow: ellipsis来实现。 另外， 也可以使用webkit - line - clamp和display: -webkit -box来实现多行文本溢出显示省略号的效果。 需要注意的是， 设置文本溢出限定的宽度会隐藏溢出内容的文本， 因此需要在溢出内容周围设置一些边界 ",
      form: {
        consultationSuggestion: "",
        description: "",
        diagnose: "",
        isLongtime: false,
        isMoveDifficult: false,
        medicationSuggestion: "",
        productList: [
          {
            count: 1,
            uproductid: "1659088089214132224",
          },
          {
            count: 2,
            uproductid: "1659088352125689856",
          },
        ],
        userid: "",
        name: "",
        gender: "",
        avatar: "",
        avatar: "",
        age: "",
      },
    };
  },
  onShow() {},
  onLoad(options) {
    if (options.data) {
      let data = JSON.parse(decodeURIComponent(options.data));
      this.form = data;
    }
  },
  methods: {
    setStatus(status) {
      let obj = {
        1: "男",
        2: "女",
      };
      return obj[status];
    },
    /* 搜索返回 */
    back() {
      /*uni.navigateBack({
					delta: 1
				})*/
      //@zxyuns 处理兼容，如果没有上一级界面则返回首页
      const pages = getCurrentPages();
      if (pages.length === 2) {
        uni.navigateBack({
          delta: 1,
        });
      } else if (pages.length === 1) {
        uni.switchTab({
          url: "/pages/index/index",
        });
      } else {
        uni.navigateBack({
          delta: 1,
        });
      }
    },
  },
};
</script>

<style>
	
	.drugBg{
		background-color: #eff5ff;
		min-height: 180rpx;
		border-radius: 10rpx;
		padding: 40rpx;
	}
	
page {
	
  padding-bottom: 200rpx;
}
</style>